<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>添加</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="../../css/oksub.css">
	<!-- <link href="https://unpkg.com/@wangeditor/editor@latest/dist/css/style.css" rel="stylesheet"/> -->
	<link rel="stylesheet" href="../../css/editor/style.css">
	<script type="text/javascript" src="../../lib/loading/okLoading.js"></script>
<style>
	#editor—wrapper {
		border: 1px solid #ccc;
		z-index: 100;
		/* 按需定义 */
	}

	#toolbar-container {
		border-bottom: 1px solid #ccc;
	}

	#editor-container {
		height: 350px;
	}
</style>

</head>
<body>
<div class="ok-body">
	<!--form表单-->
	<form class="layui-form layui-form-pane ok-form">
		<div id="editor—wrapper">
            <div id="toolbar-container"><!-- 工具栏 --></div>
            <div id="editor-container"><!-- 编辑器 --></div>
        </div>
		<div class="layui-form-item" style="margin-top: 20px;">
			<button class="layui-btn" lay-submit lay-filter="add">立即提交</button>
		</div>
	</form>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script src="../../js/editor/index.js"></script>
<!-- <script src="https://unpkg.com/@wangeditor/editor@latest/dist/index.js"></script> -->
<script type="text/javascript">
	layui.use(["form", "okLayer", "okUtils", "okMock", "laydate"], function () {
		let form = layui.form;
		let okMock = layui.okMock;
        let laydate = layui.laydate;
		let okLayer = layui.okLayer;
		let okUtils = layui.okUtils;

		//关闭loading
		okLoading.close();

		const { createEditor, createToolbar } = window.wangEditor

		const editorConfig = {
			onChange(editor) {
				const html = editor.getHtml()
				// 也可以同步到 <textarea>
			},
		}

		const editor = createEditor({
			selector: '#editor-container',
			html: '<p><br></p>',
			config: editorConfig,
			mode: 'default', // or 'simple'
		})

		const toolbarConfig = {}

		//排除指定的菜单
		toolbarConfig.excludeKeys = [
			'group-image',
			'group-video',
		]

		const toolbar = createToolbar({
			editor,
			selector: '#toolbar-container',
			config: toolbarConfig,
			mode: 'default', // or 'simple'
		})


		let id;
		//发送ajax获取入馆提醒文本
		okUtils.ajax(okMock.api.reminder.detail, "get", {type: 2}).done(function (response) {
			if (response.code == HTTP_OK) {
				id = response.data.id;
				okLayer.greenTickMsg(response.message, function () {
					parent.layer.close(parent.layer.getFrameIndex(window.name));
				});
			} else {
				layer.msg(response.message, { icon: 2, time: 2000 });
			}
		}).fail(function (error) {});



		//表单提交
		form.on("submit(add)", function (data) {
			//把编辑器的内容赋值给表单的content字段
			data.field.content = editor.getHtml();
			data.field.id = id;

			//发送ajax提交表单数据
			okUtils.ajax(okMock.api.reminder.update, "post", data.field).done(function (response) {
				if (response.code == HTTP_OK) {
                    okLayer.greenTickMsg(response.message, function () {
                        parent.layer.close(parent.layer.getFrameIndex(window.name));
                    });
                } else {
                    layer.msg(response.message, { icon: 2, time: 2000 });
                }
			}).fail(function (error) {});
			return false;
		});
	})
</script>
</body>
</html>
